<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body{
            display: flex;
            flex-direction: column;
            justify-content: center;
            height: 100vh;
            align-items: center;
            background-color: rgb(41, 41, 41);
            font-family: Arial, Helvetica, sans-serif;
            overflow: hidden;
        }
        .date,.time,.sec{
            color: #fff;
        }
        .date{
            font-size: 300px;
        }
        .time{
            font-size: 600px;
            display: flex;
            align-items: center;
        }
        .sec{
            font-size: 15px;
        }
        .dot{
            display: flex;
            flex-direction: column;
            height: 200px;
            justify-content: space-between;
            margin: 0 100px;
        }
        .dot span{
            height: 50px;
            width: 50px;
            background-color: #fff;
            border-radius: 50%;
        }
        /* .dot{
            color: rgba(32, 87, 189,0.5);
        } */
    </style>
</head>
<body>
    <div class="date"><span class="mon"></span> <span></span>月<span></span> <span class="day"></span> <span></span> 日</div>
    <div class="time"> <span class="hour"></span> <div class="dot"><span></span><span></span></div></span> <span class="minu"> </span> <span class="sec"></span> </div>
    <script>
        
        function useMytime(){
            var mon = ((new Date()).getMonth()+1 +'').padStart(2, '0')
            var day = ((new Date()).getDate()+'').padStart(2, '0');
            var hour = ((new Date()).getHours()+'').padStart(2, '0');
            var minu = ((new Date()).getMinutes()+'').padStart(2, '0');
            var sec = ((new Date()).getSeconds()+'').padStart(2, '0')

            var mon1 = document.querySelector('.mon')
            var day1 = document.querySelector('.day')
            var hour1 = document.querySelector('.hour')
            var minu1 = document.querySelector('.minu')
            var sec1 = document.querySelector('.sec')

            
            mon1.innerHTML = mon;
            day1.innerHTML = day;
            hour1.innerHTML = hour;
            minu1.innerHTML = minu;
            sec1.innerHTML = sec;

            console.log(sec);
            
        }
        function setInt(){
            setInterval(useMytime,1000);
        }
        setInt()
        // 不想看到秒数的话，可以删了<span class="sec"></span>这段
    </script>
</body>
</html>